<%--
  Created by IntelliJ IDEA.
  User: moses
  Date: 2021/5/9
  Time: 12:47 下午
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="./layui/css/login.css"/>
    <link rel="stylesheet" href="./layui/css/layui.css"/>
</head>
<body>

<div
        class="layadmin-user-login layadmin-user-display-show"
        id="LAY-user-login"
>
    <div class="layadmin-user-login-main">
        <div class="layadmin-user-login-box layadmin-user-login-header">
            <h2>图书管理系统</h2>
<%--            <p>基于Vue+Layui+SpringBoot+Mybatis前后端分离</p>--%>
        </div>

        <div class="layadmin-user-login-box layadmin-user-login-body layui-form">
            <div class="layui-form-item">
                <label
                        class="layadmin-user-login-icon layui-icon layui-icon-username"
                        for="loginName"
                ></label>
                <input
                        type="text"
                        name="username"
                        id="username"
                        autocomplete="off"
                        lay-verify="required"
                        placeholder="账号"
                        class="layui-input"
                        value="chen"
                />
            </div>
            <div class="layui-form-item">
                <label
                        class="layadmin-user-login-icon layui-icon layui-icon-password"
                        for="password"
                ></label>
                <input
                        type="password"
                        name="password"
                        id="password"
                        autocomplete="off"
                        lay-verify="required"
                        placeholder="密码"
                        class="layui-input"
                        value="chen"
                />
            </div>
            <div class="layui-form-item" style="margin-bottom: 20px;">
                <input
                        type="radio"
                        name="type"
                        value="admin"
                        title="管理员"
                />
                <input type="radio" name="type" value="user" title="用户" checked/>
            </div>
            <div class="layui-form-item">
                <button
                        type="submit"
                        class="layui-btn layui-btn-fluid"
                        lay-submit
                        lay-filter="user-login"
                        id="btn_Login"
                >
                    登 录
                </button>
            </div>
            <div class="layui-trans layui-form-item layadmin-user-login-other">
                <label>社交账号登入</label>
                <a href="javascript:;"
                ><i class="layui-icon layui-icon-login-qq"></i
                ></a>
                <a href="javascript:;"
                ><i class="layui-icon layui-icon-login-wechat"></i
                ></a>
                <a href="javascript:;"
                ><i class="layui-icon layui-icon-login-weibo"></i
                ></a>

                <a class="layadmin-user-jump-change">注册帐号</a>
            </div>
        </div>
    </div>
</div>
<script language="JavaScript" src="./layui/layui.all.js"></script>
<script>
    layui.use(['layer','form',"jquery"], function () {
        var form=layui.form,
        layer=layui.layer,
        $=layui.$;
        form.render();

        var _this=this;

        form.on('submit(user-login)', function (data) {
            // console.log(data.field)
            //获取表单提交的数据
            var d=data.field;
            //ajax请求controller
            var loadId = _this.layer.load();
            $.getJSON("/login.do", {username:d.username,password:d.password,role:d.type}, function (data) {
                console.log(data)
                // var msg = JSON.parse(data);
                if (data.code == 0) {
                    //登陆成功
                    _this.layer.close(loadId);
                    _this.layer.alert("登陆成功", function () {
                        //跳转到主页面
                        window.location.href="/main.jsp"
                    });
                } else {
                    //登陆失败
                }
            });
        });




    });
</script>

</body>
</html>
